import React, { Component } from 'react'
import SignuopForm from "./SignuopForm";
import { connect } from "react-redux"
import { bindActionCreators } from "redux";
import { userSignupRequest, isUserExists } from '../../store/actions/signupActions'
import { addFlashMessage } from '../../store/actions/flashMessages'

class SignupPage extends Component {
  render() {
    const attrs = {
      userSignupRequest: this.props.userSignupRequest,
      isUserExists: this.props.isUserExists,
      flashMessages: this.props.flashMessages
    };
    return (
      <div className='row'>
        <div className="col-md-3"></div>
        <div className="col-md-6">
          <SignuopForm {...attrs} />
        </div>
        <div className="col-md-3"></div>
      </div>
    )
  }
}

const mapDispatchToProps = dispatch => {
  return {
    userSignupRequest: bindActionCreators(userSignupRequest, dispatch),
    isUserExists: bindActionCreators(isUserExists, dispatch),
    flashMessages: bindActionCreators(addFlashMessage, dispatch)
  }
};

export default connect(null, mapDispatchToProps)(SignupPage)
